.rt-homepage-container {
  background-color: #7bc6d6;
  h2 {
    text-align: center;
    font-size: 35px;
  }
  .rt-img-box {
    text-align: center;
    position: relative;
    .rt-img {
      position: relative;
    }
    & > div {
      color: #fff;
    }
  }
  .rt-scroll-x-container {
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 40px 0;
    & > img {
      border-right: 2px solid #e8f5f5;
      width: 150px;
      height: 80px;
      &:hover {
        transform: scale(1.2, 1.4);
      }
    }
  }
}

.rt-homepage-v2-container {
  background-color: #7bc6d6;
  display: flex;
  flex-direction: column;
  h2 {
    text-align: center;
    background-color: #fff;
    padding: 10px 0;
  }
  .rt-main-box {
    display: flex;
    flex: 1;
    .rt-left {
      display: flex;
      flex-direction: column;
      overflow: auto;
      padding: 0 20px;
      direction: rtl;
      min-width: 160px;
      & > img {
        width: 150px;
        height: 80px;
        margin-bottom: 16px;
        &:hover {
          transform: scale(1.2);
        }
      }
    }
    .rt-rest {
      flex: 1;
      display: flex;
      padding-left: 30px;
      .rt-img-box {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        .rt-wrapper {
          position: relative;
          em {
            position: absolute;
            left: -30px;
            bottom: -18px;
            color: #fff;
            text-shadow: rgba(0, 0, 0, 0.9) 1px 2px 9px;
            font-size: 38px;
            padding-top: 10px;
          }
        }
      }
    }
  }
  .rt-scroll-x-container {
    display: flex;
    overflow-x: auto;
    padding: 20px;
    & > img {
      width: 150px;
      height: 80px;
      margin-right: 18px;
      &:hover {
        transform: scale(1.2, 1.4);
      }
    }
  }
}